<template>
	<view>
		<question-header
		:subject = 'subject' 
		:info="info"></question-header>
		<view class="question">
			<question-stem :subject="subject" :subjectSize="info.subjectSize"></question-stem>
			<multi-choice v-if="subject.type=='3'" :choices="subject.subjectChoices" :selectedChoice="subject.selectChoice" @change='change'></multi-choice>
			<subjection v-else-if="subject.type=='5'" :content='subject.answerContent'></subjection>
			<single-choice v-else :choices="subject.subjectChoices" @change='change'></single-choice>	
		</view>
	</view>
</template>

<script>
	import {
		isEmpty
	} from '@/utils/index'
	import QuestionHeader from './QuestionHeader';
	import QuestionStem from './QuestionStem';
	import SingleChoice from '@/pages/exam/fragments/SingleChoice';
	import MultiChoice from '@/pages/exam/fragments/MultiChoice';
	import Subjection from '@/pages/exam/fragments/Subjection.vue'
	export default {
		components: {
			QuestionHeader,
			QuestionStem,
			SingleChoice,
			MultiChoice,
			Subjection
		},
		props: {
			subject: {
				type: Object,
				default: function() {
					return {}
				}
			},
			info:{
				type:Object,
				default(){
					return {}
				}
			},
		},
		data() {
			return {}
		},
		methods: {
			change(value) {
				// console.log('选项',value);
				this.$emit('change', value);
			},
		}
	}
</script>

<style lang="scss" scoped>
	.question {
		border-radius: 8rpx;
		box-shadow: 0 0 10upx #eaeaea;
		padding: 30upx 30upx;
		font-size: 30upx;
		margin: 20upx;
		margin-bottom: 40upx;
	}
</style>
